// 需求1: 渲染一级分类数据和分页控件到页面上

//全局变量: currentPage 指当前渲染的页数, pageSize指没有显示的长度
var currentPage = 1;
var pageSize = 5;
render();
function render () {
    $.ajax({
        url: '/category/queryTopCategoryPaging',
        type: 'get',
        data: {
            page: currentPage,
            pageSize: pageSize
        },
        dataType: 'json',
        success: function (info) {
            console.log(info);
            //调用模板引擎,渲染分类数据到页面上
            $('tbody').html(template('tmp-first', info));
    
            //渲染分页控件
            var options = {
                bootstrapMajorVersion: 3,    //版本
                currentPage: currentPage,    //当前页数
                numberOfPages: 5,    //最多显示Page页
                totalPages: Math.ceil(info.total / pageSize),    //所有数据可以显示的页数
                onPageClicked: function (e, originalEvent, type, page) {
                    currentPage = page;
                    render();
                }
            }
            $(".pag-first").bootstrapPaginator(options);
        }
    
    });
}

$(function () {

    // 点击添加按钮,验证表单不能为空
        $('#form').bootstrapValidator({

            excluded: [':disabled', ':hidden', ':not(:visible)'],
            // //  指定验证后验证字段的提示字体图标。（默认是bootstrap风格）

            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },

            fields: {
                //校验用户名，对应name表单的name属性
                categoryName: {
                    validators: {
                        //不能为空
                        notEmpty: {
                            message: '用户名不能为空'
                        }
                    }
                }
            }
        });
    // 注册表单验证成功的事件,在事件中阻止submit默认行为,并发送请求,添加一级分类数据
    $('#form').on('success.form.bv', function (e) {
        e.preventDefault();
        //发送ajax请求
        $.ajax({
            url: '/category/addTopCategory',
            type: 'post',
            data: $('#form').serialize(),
            dataType: 'json',
            success: function (info) {
                console.log(info);
                if (info.success) {
                    //成功: 重置数据,隐藏模态框,重新渲染,
                    // 既能重置表单项,又能重置内容
                    $("#form").data('bootstrapValidator').resetForm(true);
                    // 隐藏模态框
                    $('#first-modal').modal('hide')
                    // 重新渲染,新添加的数据会在第一页的第一项
                    currentPage = 1;
                    render();
                } else {
                    alert('添加失败');
                    // 关闭模态框
                    $('#first-modal').modal('hide')
                }
                
            }
        })
    })      
});
